<template>
  <div class="app-container">
    <ehead index="4"></ehead>
    <uploads type="网址"></uploads>

    <div style="background-color: rgb(239 239 239 / 40%)" class="p-10 c my-10">
      <div class="content">
        <div
          class="text-center"
          style="font-size: 30px; font-weight: 800; line-height: 42px; color: rgb(16 16 16 / 100%)"
        >
          网址二维码生成器，随时修改跳转链接
        </div>
        <div>
          <el-row class="mt-10">
            <el-col :span="6">
              <div style="width: 281px; height: 188px; padding: 20px; margin: 0 auto">
                <img
                  src="https://ecodestore.oss-cn-beijing.aliyuncs.com/%E6%96%B0%E7%89%88UI%E5%9B%BE%E6%A0%87/pc/urls/%E7%BE%A4%E7%BB%84%2019%401x.png"
                />
                <!-- <div>
                  <el-skeleton style="width: 50px; height: 50px; margin: 0 auto" :loading="loading" animated>
                    <template #template>
                      <el-skeleton-item variant="image" style="width: 50px; height: 50px" />
                    </template>
                  </el-skeleton>
                </div>
                <div
                  style="
                    margin-top: 20px;
                    font-size: 20px;
                    font-weight: 800;
                    color: rgb(86 85 85 / 100%);
                    text-align: center;
                  "
                >
                  稳定跳转
                </div>
                <div style="margin-top: 10px; font-size: 18px; color: rgb(86 85 85 / 100%); text-align: center">
                  跳转快速稳定，连通性高
                </div> -->
              </div>
            </el-col>
            <el-col :span="6">
              <div style="width: 281px; height: 188px; padding: 20px; margin: 0 auto">
                <img
                  src="https://ecodestore.oss-cn-beijing.aliyuncs.com/%E6%96%B0%E7%89%88UI%E5%9B%BE%E6%A0%87/pc/urls/%E7%BE%A4%E7%BB%84%2018%401x.png"
                />
                <!-- <div>
                  <el-skeleton style="width: 50px; height: 50px; margin: 0 auto" :loading="loading" animated>
                    <template #template>
                      <el-skeleton-item variant="image" style="width: 50px; height: 50px" />
                    </template>
                  </el-skeleton>
                </div>
                <div
                  style="
                    margin-top: 20px;
                    font-size: 20px;
                    font-weight: 800;
                    color: rgb(86 85 85 / 100%);
                    text-align: center;
                  "
                >
                  永久有效
                </div>
                <div style="margin-top: 10px; font-size: 18px; color: rgb(86 85 85 / 100%); text-align: center">
                  生成的网址二维码永久有效
                </div> -->
              </div>
            </el-col>
            <el-col :span="6">
              <div style="width: 281px; height: 188px; padding: 20px; margin: 0 auto">
                <img
                  src="https://ecodestore.oss-cn-beijing.aliyuncs.com/%E6%96%B0%E7%89%88UI%E5%9B%BE%E6%A0%87/pc/urls/%E7%BE%A4%E7%BB%84%2020%401x.png"
                />
                <!-- <div>
                  <el-skeleton style="width: 50px; height: 50px; margin: 0 auto" :loading="loading" animated>
                    <template #template>
                      <el-skeleton-item variant="image" style="width: 50px; height: 50px" />
                    </template>
                  </el-skeleton>
                </div>
                <div
                  style="
                    margin-top: 20px;
                    font-size: 20px;
                    font-weight: 800;
                    color: rgb(86 85 85 / 100%);
                    text-align: center;
                  "
                >
                  随时修改
                </div>
                <div style="margin-top: 10px; font-size: 18px; color: rgb(86 85 85 / 100%); text-align: center">
                  随时修改二维码的跳转地址
                </div> -->
              </div>
            </el-col>
            <el-col :span="6">
              <div style="width: 281px; height: 188px; padding: 20px; margin: 0 auto">
                <img
                  src="https://ecodestore.oss-cn-beijing.aliyuncs.com/%E6%96%B0%E7%89%88UI%E5%9B%BE%E6%A0%87/pc/urls/%E7%BE%A4%E7%BB%84%2021%401x.png"
                />
                <!-- <div>
                  <el-skeleton style="width: 50px; height: 50px; margin: 0 auto" :loading="loading" animated>
                    <template #template>
                      <el-skeleton-item variant="image" style="width: 50px; height: 50px" />
                    </template>
                  </el-skeleton>
                </div>
                <div
                  style="
                    margin-top: 20px;
                    font-size: 20px;
                    font-weight: 800;
                    color: rgb(86 85 85 / 100%);
                    text-align: center;
                  "
                >
                  数据统计
                </div>
                <div style="margin-top: 10px; font-size: 18px; color: rgb(86 85 85 / 100%); text-align: center">
                  多维度数据统计报表
                </div> -->
              </div>
            </el-col>
          </el-row>
        </div>
      </div>
    </div>
    <div style="background-color: rgb(255 255 255 / 100%)" class="p-10 c my-10">
      <div class="content">
        <div
          class="text-center"
          style="font-size: 30px; font-weight: 800; line-height: 42px; color: rgb(16 16 16 / 100%)"
        >
          常见问题
        </div>

        <el-row class="mt-10">
          <el-col :span="12">
            <div class="m-2" style="font-size: 20px; font-weight: 600">网址静态码和活码有什么区别？</div>
            <div class="m-2">
              网址静态码： 把输入的网址直接编码成为二维码，生成后无法修改网址，不能统计扫码量，适用于网址无需变更的情况。<br />
              网址活码：互联二维码会自动分配一个短网址用来跳转输入的目标网址，然后把这个短网址生成二维码，扫码后可以实时跳转到目标网址并记录访问数据。后期修改跳转目标网址时，二维码图案不变。
            </div>
            <div class="m-2 mt-8" style="font-size: 20px; font-weight: 600">生成的网址活码无法正常访问？</div>
            <div class="m-2">
              扫码是对二维码进行解码，并实时跳转到对应网址，所以二维码不存在失效问题。<br />
              1、网址本身异常：扫码显示空白、错误等，复制二维码中的网址至微信，如无法正常访问，则证明该网址异常。<br />
              2、网址为扫码app禁止的链接：如淘宝链接生成二维码，而微信限制直接打开淘宝链接。<br />
              3、内容违规：若活码内容违规，将会被限制访问。
            </div>
          </el-col>
          <el-col :span="12">
            <div class="m-2" style="font-size: 20px; font-weight: 600">网址活码扫码后有提示页无法访问？</div>
            <div class="m-2">
              因为网址活码可随时修改网址，扫码后直接跳转存在安全风险。<br />
              免费用户创建的活码在微信中只能复制链接不能跳转，在浏览器中访问会出现安全提示页，需要用户点击后访问。<br />
              如需直接跳转，请升级VIP。
            </div>
            <div class="m-2 mt-8" style="font-size: 20px; font-weight: 600">哪些网址在互联二维码上不能做？</div>
            <div class="m-2">
              所有需要特殊经营资质的内容和下载链接等（如棋牌类APP下载链接，支付链接等）。<br />
              未经icp备案，且内容可能存在风险，或者无法访问的网址链接。 短网址链接； 违反微信规则的相关链接。<br />
              其他各种违反法律法规的链接，包括但不限于色情，博彩，欺诈等内容的网址链接。
            </div>
          </el-col>
        </el-row>
      </div>
    </div>
    <div style="background-color: rgb(239 239 239 / 40%)" class="p-10 c my-10">
      <div class="content">
        <div
          class="text-center"
          style="font-size: 30px; font-weight: 800; line-height: 42px; color: rgb(16 16 16 / 100%)"
        >
          免费即可使用，通过更多应用案例快速创建
        </div>
        <div class="text-center mt-4" style="font-size: 18px; color: rgb(86 85 85 / 100%)">
          我们整理了用户的真实使用案例，并做成了模板，你可以修改内容，快速创建你的二维码
        </div>
        <div class="text-center mt-10">
          <a href="/v3">
            <el-button
              class="mt-10"
              color="#333333"
              size="large"
              style="width: 140px; height: 50px; margin: 0 auto; font-size: 16px"
              >立即使用</el-button
            >
          </a>
        </div>
      </div>
    </div>
    <efoot></efoot>
  </div>
</template>

<script setup>
import uploads from '@/views/components/index/upload.vue';
import ehead from '@/views/components/index/head.vue';
import efoot from '@/views/components/index/foot.vue';
onMounted(() => {});
</script>
<style scoped lang="less">
.content {
  width: 1200px;
  margin: 0 auto;
}
.c {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 60px 20px;
  min-width: 1200px;
}
</style>

